<template>
    <div id="apps">
        <div style="color: #999999;margin-left: 1%;">
            <span>政府平台</span><span>></span><span>企业问题管理</span><span>></span><span>处理报表问题</span>
            <h3 style="color: black;">新增报表</h3>

        </div>
        <div style="width: 94%;height: 40px;margin-left: 3%;display: flex;">
            <div>
                <input type="text" placeholder="报表名称"
                    style="width: 300px;height: 30px;border-radius: 4px;border: #e4e4e4 1px solid;">

            </div>
            <div
                style="width: 500px;border: 1px solid #e4e4e4;height: 35px;border-radius: 4px;margin-left: 10%;line-height: 30px;">
                <span style="color: #999999;">统计区间</span><select name="" id="" style="width: 100px;margin-left: 3%;">
                    <option value="1">年</option>
                    <option value="2">半年</option>
                    <option value="3">季度</option>
                    <option value="4">月</option>
                    <option value="5">半月</option>
                    <option value="6">周</option>
                </select><input style="margin-left: 3%;color: #999999;width: 80px;border: 0px;"
                    placeholder="2020-5-25"><span style="color:#999999;">至</span><input
                    style="color: #999999;width: 80px;border: 0px;margin-left: 3%;" placeholder="2022-5-25">
            </div>
        </div>
        <div style="margin-left: 3%;width: 76%;height: 40px;border:1px solid #e4e4e4;border-radius: 4px;line-height: 40px;display: flex;justify-content: space-between;margin-top: 30px;">
            <span style="color: #e4e4e4;margin-left: 1%;">统计部门</span>
            <div> <input type="checkbox"><span style="font-size: 14px;color: #999999;">所有</span></div>
            <div> <input type="checkbox" checked="checked"><span style="font-size: 14px;color: #999999;">工商管理部门</span></div>
            <div> <input type="checkbox" checked="checked"><span style="font-size: 14px;color: #999999;">土地管理部门</span></div>
            <div> <input type="checkbox"><span style="font-size: 14px;color: #999999;">行政许可部门</span></div>
            <div> <input type="checkbox"><span style="font-size: 14px;color: #999999;">人事部门</span></div>
            <div> <input type="checkbox"><span style="font-size: 14px;color: #999999;">环保部门</span></div>
            <div> <input type="checkbox"><span style="font-size: 14px;color: #999999;">社保部门</span></div>
        </div>
        <div style="margin-left: 3%;width: 76%;display: flex;justify-content: space-between;margin-top: 30px;">
            <div style="width: 35%;height: 40px;border: 1px solid #e4e4e4;border-radius: 4px;line-height: 40px;" >
                <span style="color: #e4e4e4;margin-left: 2%;">用途</span><select name="" id="" style="margin-left: 20%;width: 60%;">
                    <option value="1">请选择</option>
                    <option value="2">例行存档</option>
                    <option value="3">领导汇报</option>
                </select>
            </div>
            <div  style="width: 35%;height: 40px;border: 1px solid #e4e4e4;border-radius: 4px;line-height: 40px;">
                <span style="color: #e4e4e4;margin-left: 2%;">附带图表</span>
                <input type="checkbox" style="margin-left: 20%;"><span style="font-size: 14px;color: #999999;">是</span>
                <input type="checkbox" checked="checked"><span style="font-size: 14px;color: #999999;" >否</span>
            </div>
        </div>
        <div style="margin-top: 30px;width: 94%;height: 200px;border: #e4e4e4 1px solid;margin-left: 3%;border-radius: 4px;">
            <input type="textarea" name="" id="" style="width: 100%;height: 100%;border: 1px solid #e4e4e4;" placeholder="备注" >
        </div>
        <div style="margin-top: 30px;width: 94%;height: 40px;border: #e4e4e4 1px solid;margin-left: 3%;line-height: 40px;border-radius: 4px;">
        <span style="color: #e4e4e4;">上传附件</span>   <input type="file" style="margin-left: 5%;">
        </div>
        <div style="width: 94%;margin-top: 40px;margin-left: 3%;display: flex;justify-content: center;margin-bottom: 20px;">
            <div style="display: flex;"><button style="margin-right: 30px;border: 0px;background-color: #0099ff;width: 100px;height: 40px;display: inline-block;color: white;" @click="cancel">取消</button><button style="margin-right: 30px;border: 0px;background-color: #0099ff;width: 100px;height: 40px;display: inline-block;color: white;" @click="settb">生成报表</button></div>
        </div>

    </div>
</template>

<script>
import { ref } from 'vue'
import { useRoute } from 'vue-router'
import { useRouter } from 'vue-router'
export default {
    name: "HandleProblem",
    setup() {
        const route = useRoute();
        const router = useRouter()
        const cancel=()=>{
            router.push({path:"/Problemreport"})
        }
        const settb=()=>{
            router.push({path:"/Problemreport"})
        }
      
        return {
               cancel,
               settb
        }
    }
}

</script>

<style  scoped>#apps {
    width: 80%;
    /* height: 300px; */
    /* height: 800px; */
    background-color: white;
    /* border: 1px solid red; */
    border-radius: 8px;

}</style>